<%--
  Created by IntelliJ IDEA.
  User: 61777
  Date: 2019/10/30
  Time: 20:34
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE html>
<html lang="UTF-8">
<head>
    <jsp:include page="header.jsp"></jsp:include>
    <script>
     $(function(){
         $("#rightBtn").click(function(){
             $("#leftSelect>option:selected").appendTo("#rightSelect");
         });
         $("#leftBtn").click(function(){
             $("#rightSelect>option:selected").appendTo("#leftSelect");
         });
         $("#submitBtn").click(function(){

             $("#rightSelect>option").prop("selected","selected");

         });
     })

    </script>
</head>

<body>
<jsp:include page="nav.jsp"/>

<div class="container-fluid">
    <div class="row">

        <jsp:include page="sidebar.jsp"/>

        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <ol class="breadcrumb">
                <li><a href="#">首页</a></li>
                <li><a href="#">数据列表</a></li>
                <li class="active">分配角色</li>
            </ol>
            <div class="panel panel-default">
                <div class="panel-body">
                    <form role="form" class="form-inline" action="assign/role.html" method="post">

                        <input type="hidden" name="adminId" value="${param.adminId}">
                        <input type="hidden" name="pageNum" value="${param.pageNum}">

                        <div class="form-group">
                            <label for="exampleInputPassword1">未分配角色列表</label><br>

                            <select id="leftSelect" class="form-control" multiple="" size="10" style="width:100px;overflow-y:auto;">

                                <c:forEach items="${requestScope.unAssignedRoleList }" var="role">
                                    <option value="${role.id }">${role.name }</option>
                                </c:forEach>

                            </select>

                        </div>
                        <div class="form-group">
                            <ul>
                                <li id="rightBtn"
                                    class="btn btn-default glyphicon glyphicon-chevron-right"></li>
                                <br>
                                <li id="leftBtn"
                                    class="btn btn-default glyphicon glyphicon-chevron-left"
                                    style="margin-top: 20px;"></li>
                            </ul>
                        </div>
                        <div class="form-group" style="margin-left:40px;">
                            <label for="exampleInputPassword1">已分配角色列表</label><br>
                            <select
                                    id="rightSelect" name="roleIdList" class="form-control"
                                    multiple size="10" style="width: 100px; overflow-y: auto;">

                                <c:forEach items="${requestScope.assignedRoleList }" var="role">
                                    <option value="${role.id }">${role.name }</option>
                                </c:forEach>

                            </select>
                        </div>
                        <button id="submitBtn" type="submit" style="width: 200px;"
                                class="btn btn-success btn-lg btn-block">分配</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>
